import ufr, { Method, UfrResponse } from "@eric/ufr";
import { useEffect } from "react";

const baseUrl = 'http://localhost:30002';
ufr.baseUrl = baseUrl;

interface ApiData {
  code: number;
  errMsg: string;
  data?: any;
}

interface User {
  id: number;
  name: string;
}

export default () => {
  // @ts-ignore
  const ufrTest = async (path: string, options?: any = {}) => {
    // 1. url + opts
    // const res = await ufr(path, options);
    // 2. opts
    const res = await ufr<UfrResponse<ApiData>>({ ...options, path });
    // 3. method(url, opts)
    // let method: Method = options?.method ? options.method.toLowerCase() : 'get';
    // const res = await ufr[method]<ApiData>(path, {
    //   ...options,
    //   interceptor: {
    //     response: (res) => {
    //       console.log('response', res);
    //       return res.json();
    //     }
    //   }
    // });
    // console.log('res', res.code);
    // 4. method(opts)
    // let method: Method = options?.method ? options.method.toLowerCase() : 'get';
    // const res = await ufr[method]<ApiData>({ ...options, path });
    console.log('ufrTest: ', res);
  }

  useEffect(() => {
    console.log('ufr: ', ufr.namespace);
  }, [])
  return <div>
    <div onClick={() => ufrTest('/api/v1/404')}>Get /api/v1/404 no-Content-Type 测试</div>
    <div onClick={() => ufrTest('/api/v1')}>Get /api/v1 text/plain 测试</div>
    <div onClick={() => ufrTest('/api/v1/users', { method: 'POST' })}>POST /api/v1/users json/application 测试</div>
    <div onClick={() => ufrTest('/api/v1/users', {
      method: 'POST',
      interceptor: {
        request: (req) => {
          console.log('request', req);
          return req;
        },
      }
    })}>POST /api/v1/users json/application request 拦截器测试</div>
  </div>
}